<!DOCTYPE html>
<html lang="en" >

<head>
	<meta charset="UTF-8">
	<meta name="viewport"
		content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>CC宝</title>

	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/yzl.css" />

	<style>
        		.table {
  border: 0px solid darkgray;
 }
 .tr {
  display: flex;
  width: 100%;
  justify-content: center;
  height: 3rem;
  font-size: 12px;
  align-items: center;
 }
 .td {
  width:40%;
  justify-content: center;
  text-align: center;
 }
 .bg-w{
  background: snow;
 }
 .bg-g{
  background: #E6F3F9;
 }
 .th {
  width: 40%;
  justify-content: center;
  color: #fff;
  display: flex;
  height: 3rem;
  align-items: center;
 }
	</style>

</head>

<body style="background: linear-gradient(to bottom, #FC673C, #FEF2C9);height: 100%;">
	<div id="blank" class="header">
		<div v-back.tapmode class="back"></div>
		<span class="title">CC宝</span>
	</div>
	<div id="app" class="main-container" style="margin-top: 60px;" v-cloak>
        <div class="marincenter">
		<div class="bottom_area" style="margin-top: 0px;">
			<div class="lixi_button" style="background-color:#FBF2EB;color: #FC673C;" v-myclick="getlixi" v-show="!isget">领取利息</div>
			<div class="lixi_button" style="background-color:#C0C0C0;color: #fff;" v-myclick="hasget" v-show="isget">领取利息</div>

		</div>
        <div class="headertop"><span>总金额（CC）</span>
            <img class="eyeimg" v-src="'../../image/login_open_eye.png'" v-show="showtype" @click="changetype">
            <img class="eyeimg" v-src="'../../image/logon_hide.png'" v-show="!showtype" @click="changetype">
        </div>
        <div class="hearamount">{{showtype?user.amount:'****'}}</div>
        <div class="headerincome">
            <div class="headeritem">
                <div class="itemheader">昨日收益(CC)</div>
                <div v-show="showtype">{{user.yesterdaydata?user.yesterdaydata:'0.00'}}</div>
                <div v-show="!showtype">****</div>

            </div>
            <div class="headeritem" v-open-win vurl="wallet_list">
                <div class="itemheader">累积收益(CC)</div>
                <div v-show="showtype">{{user.totaldata?user.totaldata:'0.00'}}</div>
				<div v-show="!showtype">****</div>
            </div>
            <div class="headeritem">
                <div class="itemheader">今日利率(%)</div>
                <div>{{user.interest*100}}%</div>
            </div>
            <div style="clear: both;"></div>
        </div>
        <div class="bottom_area">
            <div class="bottom_button" style="background-color:#FBF2EB;color: #FC673C;" v-open-win vurl="exportcoin">转出</div>
            <div class="bottom_button" style="background-color:#FC673C;color: #fff;" v-open-win vurl="importcoin">转入</div>
        </div>
        		<div class="wallet_desc">
			<div style="margin: 15px;font-size: 12px;">利率表</div>
			<div class="table">
				<block >
				<div class="tr" style="border-bottom:1px solid #eee">
				<div class="td">限额(CC)</div>
				<div class="td">每天利率</div>
				<div class="td">年化利率</div>
				<div class="td">年利息(CC)</div>
				</div>
				</block>
				 <block>
				<div class="tr">
				<div class="td">1000</div>
				<div class="td">0.050%</div>
				<div class="td">18.250%</div>
				<div class="td">182.5</div>
				</div>
				</block>
				 <block>
				<div class="tr">
				<div class="td">10000</div>
				<div class="td">0.020%</div>
				<div class="td">7.300%</div>
				<div class="td">730</div>
				</div>
				</block>
				<block>
				<div class="tr">
				<div class="td">100000</div>
				<div class="td">0.010%</div>
				<div class="td">3.650%</div>
				<div class="td">3650</div>
				</div>
				</block>
				<block>
				<div class="tr">
				<div class="td">1000000</div>
				<div class="td">0.005%</div>
				<div class="td">1.825%</div>
				<div class="td">18250</div>
				</div>
				</block>
				<block>
				<div class="tr">
				<div class="td">10000000</div>
				<div class="td">0.002%</div>
				<div class="td">0.730%</div>
				<div class="td">73000</div>
				</div>
				</block>
			   </div>
		</div>
    </div>

	</div>
</body>
<script src="../../script/api.js"></script>
<script src="../../script/vue.js"></script>
<script src="../../script/app.js"></script>
<script src="../../script/common.js"></script>
<script src="../../script/url.js"></script>
<script>
	var user;
	var isget;
	var vm;
	apiready = function () {
		setBSImg();
		new Vue({
			el: '#blank'
		});
		var sigmobAds = api.require('sigmobAds');
        sigmobAds.initSdk({
			userId:getPrefs('member_id'),
		},function(ret, err) {
			if (ret.status) {
				console.log("sdk 初始化成功");
			} else {
				console.log('sdk 初始化失败');
			}
		});
		showProgress();
		var data = {member_id: getPrefs('member_id')};
            var callback = function (ret) {

            user = ret.content;
			isget = ret.isget;
            initApp();
            api.parseTapmode();
            setPrefs('user', user);
        };

        pinet.post(URL.getwallet, data, callback);
		addListeners();
	};

	function initApp() {
		 vm = new Vue({
			el: '#app',
			data: {
				BSImg: {
					big: Vue.BSImg == 'big',
					small: Vue.BSImg == 'small'
				},
                showtype:true,
				user:user,
				isget:isget,
			},
			methods: {
                changetype:function (){
                    this.showtype = !this.showtype
                },
				getlixi: function () {
                    var items = ['f1138d8b22c','f1138dd181e'];
                    var item = items[Math.floor(Math.random()*items.length)];
					var sigmobAds = api.require('sigmobAds');
					sigmobAds.showRewardVideoAD({
						posId: item,
						// posId: "ebeec337910",ios
					}, function(ret, err) {
                        console.log(JSON.stringify(ret))
						
						if (ret.status) {
							if(ret.type == "onShow"){ //展示

							}

							if(ret.type == "onClosed"){ //关闭

							}
                            if(ret.type == "onCompleted"){ //关闭
                                vm.synclixi()
                                }
						} else {
                            vm.synclixi()
                            // console.log(JSON.stringify(ret))
							// alert(JSON.stringify(err));
						}
					});

                },
                synclixi(){
                    var data = {
                        member_id: getPrefs('member_id')
                    };
                    var callback = function (ret) {
                        api.toast({
                            msg:'领取成功'
                        })
                        vm.isget = true
                    };
                    pinet.post(URL.getlixi, data, callback);
                },
				hasget:function(){
					api.toast({
						msg:'今日已领取过利息'
					})
				}
			},
			mounted: function () {
				var input = document.getElementById('input');
			}
		});
	}
    function refresh() {
		var data = {member_id: getPrefs('member_id')};
            var callback = function (ret) {
            vm.user = ret.content;
        };

        pinet.post(URL.getwallet, data, callback);

    }
	function addListeners() {
		api.addEventListener({
			name: 'viewappear'
		}, function () {
			onPageStart();
		});
        api.addEventListener({
            name: 'upduser'
        }, refresh);
		api.addEventListener({
			name: 'viewdisappear'
		}, function (ret, err) {
			onPageEnd();
		});

		api.addEventListener({
			name: 'keyback'
		}, function (ret, err) {
			onPageEnd();
			api.closeWin();
		});
	}
</script>

</html>